<template>
	<view class="login">
		<p>欢迎登录{{configInfo.site_title}}！</p>
		<image :src="portrait||imgUrl + configInfo.logo"></image>
		<!-- 此处如果是通过分享进入 应该展示分享者的头像 昵称 -->
		<span>{{nick}}</span>
		<button @click="getUserToken">登录</button>
		<view>
			<span :class="{'span':value}" @click='value=!value'>
				<u-icon v-if="value" name="checkbox-mark" color="#fff" size="10"></u-icon>
			</span>
			<p>勾选同意<span @click='skip(0)'>《服务协议》</span>和<span @click='skip(1)'>《隐私政策》</span></p>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				imgUrl: "",
				configInfo: {
					logo: ''
				},
				appid: '',
				page: '',
				code: '',
				portrait: '',
				nick: '',
				mobile: "",
				inviteCode: "",
				value: true
			};
		},
		methods: {
			getUserToken() {
				// 先调用微信授权 获取code
				if (!this.value) {
					uni.showToast({
						title: '请勾选协议后登录',
						icon: 'none',
						duration: 2000
					});
					return
				}
				if (this.value) {
					let api = window.location.href.split('?')[1] ? window.location.href.split('?')[1] + '&ins=true' :
						'?ins=true'
					let redirect_uri = encodeURIComponent(this.page + '#/pages/login/login?' + api)
					let href = 'https://open.weixin.qq.com/connect/oauth2/authorize?'
					href += 'appid=' + this.appid + '&redirect_uri=' + redirect_uri +
						'&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect'
					window.location.href = href;
				}
			},
			getUserInfoByCode() {
				this.$httpRequest('/user/getUserInfoByCode', {
					invite_code: this.inviteCode
				}).then(res => {
					if (res.data) {
						this.mobile = res.data.mobile;
						this.portrait = res.data.avatar;
						this.nick = res.data.nick;
					}
				});
			},
			skip(index) {
				uni.navigateTo({
					url: '/pages/agreement/agreement?type=' + index
				});
			},
			getConfigInfo(option) {
				this.$httpRequest('/index/getConfigInfo').then(res => {
					// uni.setStorageSync('configInfo', JSON.stringify({
					// 	logo: res.data.logo,
					// 	site_title: res.data.site_title,
					// 	withdraw_config: res.data.withdraw_config,
					// 	app_id: res.data.wechat_app_id,
					// }));
					this.configInfo = {
						logo: res.data.logo,
						site_title: res.data.site_title,
						withdraw_config: res.data.withdraw_config,
						app_id: res.data.wechat_app_id,
					}
					uni.setStorageSync('configInfo', JSON.stringify(this.configInfo))
					this.appid = this.configInfo.app_id;
					this.inviteCode = option.invite_code || '';
					if (this.inviteCode) {
						this.getUserInfoByCode();
					}
					this.page = this.$pages
					this.imgUrl = this.$imgUrl;
					if (option.ins) {

						let url = window.location.href;
						// 创建URL对象
						var urlObj = new URL(url);
						// 使用URLSearchParams获取参数值
						var params = new URLSearchParams(urlObj.search);
						let token = uni.getStorageSync('userToken');
						var code = params.get("code");
						this.code = code
						if (this.code) {
							// 得到code值 调用此方法  需要传参 code(必须)，invite_code(邀请码 如果是分享进入必填)
							this.$httpRequest('/wx/getAccessToken', {
								code: this.code,
								invite_code: this.inviteCode || ''
							}).then(res => {
								// 获取到token 存入缓存 
								uni.setStorageSync('userToken', res.data.token);
								if (res.data.exists_mobile == -2) {
									uni.redirectTo({
										url: '/pages/phone/phone'
									});
									return
								}
								// let urlInfo = uni.getStorageSync('currentUrl');
								// if (urlInfo) {
								// 	let url = JSON.parse(urlInfo);
								// 	if (url.flag) {
								// 		uni.switchTab({
								// 			url: url.url
								// 		});
								// 	} else {
								// 		uni.redirectTo({
								// 			url: url.url
								// 		});
								// 	}
								// } else {
								window.location.href = this.$pages + "#/pages/home/home"
								// }

							});
						}
					}
				})
			},
		},
		onLoad(option) {
			if (uni.getStorageSync('configInfo')) {
				this.configInfo = JSON.parse(uni.getStorageSync('configInfo'))
			}
			this.getConfigInfo(option);
		}
	}
</script>

<style lang="less">
	.login {
		width: 100vw;
		height: 100vh;
		background: url('../../static/52.png');
		background-size: 100% 100%;
		padding-top: 192rpx;
		box-sizing: border-box;

		&>view {
			margin-top: 40rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			position: fixed;
			bottom: 20rpx;
			width: 100%;

			&>P {
				font-size: 13px;
				color: #fff;

				&>span {
					color: #5af;
				}
			}

			&>.span {
				background: #5af;
			}

			&>span {
				width: 30rpx;
				height: 30rpx;
				border-radius: 50%;
				background: #fff;
				display: flex;
				align-items: center;
				justify-content: center;
				margin-right: 10rpx;
			}
		}

		&>span {
			width: 100%;
			display: flex;
			color: #fff;
			font-size: 18px;
			justify-content: center;
			margin: 40rpx 0 75rpx;
		}

		&>p {
			font-size: 20px;
			color: #fff;
			margin: 0 0 0 48rpx;
		}

		&>image {
			width: 364rpx;
			height: 364rpx;
			margin: 132rpx auto 0;
			display: block;
			border-radius: 64rpx;
			image-rendering: -moz-crisp-edges;
			image-rendering: -o-crisp-edges;
			image-rendering: -webkit-optimize-contrast;
			image-rendering: crisp-edges;
			-ms-interpolation-mode: nearest-neighbor;
		}

		&>button {
			margin-top: 100rpx;
			width: 458rpx;
			height: 88rpx;
			color: #3B7933;
			font-size: 18px;
			line-height: 88rpx;
		}
	}
</style>